@extends('layouts.mobile_main')

@section('title', '今日')

@section('resources')
    @parent
    <link rel="stylesheet" href="{{ env('CSS_DOMAIN') }}/css/public.css?v={{env('CSS_VERSION')}}">
    <link rel="stylesheet" href="{{env('CSS_DOMAIN')}} /css/kalendae.css?v={{env('CSS_VERSION')}}" type="text/css">
    <script src="{{ env('JS_DOMAIN') }}/js/adaptation.js?v={{env('JS_VERSION')}}"></script>
    <style>
        .busy_name{display:block;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;width: 6.5rem;}
    </style>
@endsection

@section('content')
<header class="trailer">
	<div class="oh fl">
        <a style="margin: 0.4rem 2.8rem 0 0.6rem;" class="fl" href="javascript:history.go(-1);">
            <img style="width: 0.48rem;" class="fl" src="{{env('IMAGE_DOMAIN')}}/images/back_w.png?v={{env('IMAGE_VERSION')}}" alt="">
        </a>
		<span class="fz_48 co_white fl">21点正在发生</span>
	</div>
	<!-- <img class="fr search_img" src="{{env('IMAGE_DOMAIN')}}/images/search_w.png?v={{env('IMAGE_VERSION')}}" alt=""> -->
</header>
<section class="trailer_contain pr">
	<div class="trailer_contain_text oh tc">
		<p class="fl">
			<span class="fz_40 tc">全部分类</span>
			<img style="width: 0.4rem;margin-left: 0.1rem;margin-top: 0.35rem;" class="fl" src="{{env('IMAGE_DOMAIN')}}/images/down_g.png?v={{env('IMAGE_VERSION')}}" alt="">
		</p>
		<p>
			<span class="fz_40 tc">全城</span>
			<img style="width: 0.4rem;margin-left: 0.1rem;margin-top: 0.35rem;" class="fl" src="{{env('IMAGE_DOMAIN')}}/images/down_g.png?v={{env('IMAGE_VERSION')}}" alt="">
		</p>
		<p>
			<span class="fz_40 tc">排序</span>
			<img style="width: 0.4rem;margin-left: 0.1rem;margin-top: 0.35rem;" class="fl" src="{{env('IMAGE_DOMAIN')}}/images/down_g.png?v={{env('IMAGE_VERSION')}}" alt="">
		</p>
	</div>
	<!-- 下拉选择框 -->
	<p class="mark" style="display: none;"></p>
	<div>
		<div class="box_outer oh" style="display: none;">
			<ul class="box_left1 box_left oh fl">
				@foreach($categorylists as $catgoryList)
				    <li>
                        <span>{{$catgoryList['name']}}</span>
                    </li>
				@endforeach
			</ul>
			<div>
				@foreach($categorylists as $categoryList)
				<ol class="box_right box_right1 fl">
				    <li>
                        <a href="/mobile/night?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&isfirstclass=1&classid={{$categoryList['id']}}">
                            <span>全部</span>
                        </a>
                    </li>
					@foreach($categoryList['childlists'] as $childList)
                        <li>
                            <a href="/mobile/night?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&isfirstclass=0&classid={{$childList['id']}}">
                                <span>{{$childList['name']}}</span>
                            </a>
                        </li>
					@endforeach
				</ol>
				@endforeach
			</div>
		</div>
		<div class="box_outer oh" style="display: none;">
			<ul class="box_left2 box_left oh fl">
				@foreach($arealists as $arealist)
				    <li>
                        <span>{{$arealist['name']}}</span>
                    </li>
				@endforeach
			</ul>
			<div>
				@foreach($arealists as $arealist)
				    <ol class="box_right box_right2 fl" style="display: block;">
				        <li>
                             <a href="/mobile/night?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&districtid={{$arealist['id']}}">
                                <span>全部</span>
                             </a>
                        </li>
				        @foreach($arealist['childlists'] as $childlist)
				            <li>
                                <a href="/mobile/night?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&districtid={{$arealist['id']}}&businessareaid={{$childlist['id']}}">
                                    <span>{{$childlist['name']}}</span>
                                </a>
                            </li>
				        @endforeach
				    </ol>
				@endforeach
			</div>
		</div>
		<div class="box_outer oh" style="display: none;">
			<ul class="box_left3 box_left oh fl" style="width: 100%;max-height: 8rem;">
                <a href="/mobile/next?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&sort=intelligent">
                    <li>
                        <span>智能排序</span>
                    </li>
                </a>
                <a href="/mobile/next?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&sort=distance">
                    <li>
                        <span>离我最近</span>
                    </li>
                </a>
                {{--<a href="/mobile/next?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&sort=sales">--}}
                    {{--<li>--}}
                        {{--<span>销量优先</span>--}}
                    {{--</li>--}}
                {{--</a>--}}
                <a href="/mobile/next?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&sort=commentmark">
                    <li>
                        <span>评分优先</span>
                    </li>
                </a>
                {{--<a href="/mobile/next?cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}&sort=newshop">--}}
                    {{--<li>--}}
                        {{--<span>新店优先</span>--}}
                    {{--</li>--}}
                {{--</a>--}}
            </ul>
		</div>
	</div>
</section>
<section class="nearby1">
	<ul class="nearby_all">
		@foreach($shoplists as $shoplist)
            <li class="oh nearby_cen">
                <a href="/mobile/shop/get?shopid={{$shoplist['shopid']}}&cityid={{$cityid}}&mylongitude={{$mylongitude}}&mylatitude={{$mylatitude}}">
                    <div class="fl nearby_busypic pr">
                        <p class="search_time fz_28 tc">今日翻倍花</p>
                        <img class="fl" src="{{env('IMAGE_DOMAIN')}}{{$shoplist['logo']}}" alt="">
                    </div>
                    <div class="fr nearby_busytext">
                        <div class="fz_44 oh">
                            <h2 class="fl fz_44 busy_name">{{$shoplist['name']}}</h2>
                            {{--<em class="fr nearby_score">{{$shoplist['commentmark']}}分</em>--}}
                        </div>
                        <p class="fz_34 oh nearby_family">
                            <span class="fl">{{$shoplist['secondclassname']}}</span>
                            {{--<span class="fr">{{$shoplist['ordernumber']}}笔消费</span>--}}
                        </p>
                        <p class="fz_28 oh nearby_address">
                            <span class="fl">{{$shoplist['districtname'] . $shoplist['businessareaname']}}</span>
                            {{--<span class="fr"><100M</span>--}}
                        </p>
                    </div>
                </a>
            </li>
		@endforeach
	</ul>
</section>
@endsection

@section("scriptResources")
@parent
<script src="{{ env('JS_DOMAIN') }}/js/banner.js?v={{env('JS_VERSION')}}"></script>
<script src="{{ env('JS_DOMAIN') }}/js/kalendae.standalone.js?v={{env('JS_VERSION')}}" type="text/javascript"></script>
<script>
    window.onresize=function(){
        pagesp();
    }
    $(function(){
        var mark_h=$(window).height()-$(".trailer").height()-$(".trailer_contain_text").height();
        $(".mark").css({"height":mark_h-1});
        $(".trailer_contain_text p").click(function(){//下拉框
            var i=$(this).index();
            $(".trailer_contain_text p").eq(i).css({"color":"#9a54c6","border-bottom":" 3px solid #9955C6"}).siblings().css({"color":"#000","border-bottom":" none"});
            $(".trailer_contain_text p img").eq(i).attr("src","{{env('IMAGE_DOMAIN')}}/images/down_p.png?v={{env('IMAGE_VERSION')}}").parent(".trailer_contain_text p").siblings().children(".trailer_contain_text p img").attr("src","{{env('IMAGE_DOMAIN')}}/images/down_g.png?v={{env('IMAGE_VERSION')}}");
            $(".mark").show();
            $(".nearby1").css({"overflow":"hidden","height":mark_h-1});
            $(".box_outer").eq(i).show().siblings().hide();
        })
        $(".box_left1 li").click(function(){
            var i=$(this).index();
            $(".box_left1 li").eq(i).addClass("box_show").siblings().removeClass();
            $(".box_right1").eq(i).show().siblings().hide();
            $("html").click(function(e){
                e.stopPropagation();
                var poy=e.pageY;
                if(poy<=$(".trailer").height()||poy>=($(".trailer").height()+$(".trailer_contain_text").height()+$(".box_outer").height())){
                    $(".mark").hide();
                    $(".nearby1").css({"overflow":null,"height":""});
                    $(".box_outer").hide();
                    $(".trailer_contain_text p").css({"color":"#000","border-bottom":" none"});
                }
            })
        })
        $(".box_left2 li").click(function(){
            var i=$(this).index();
            $(".box_left2 li").eq(i).addClass("box_show").siblings().removeClass();
            $(".box_right2").eq(i).show().siblings().hide();
            $("html").click(function(e){
                e.stopPropagation();
                var poy=e.pageY;
                if(poy<=$(".trailer").height()||poy>=($(".trailer").height()+$(".trailer_contain_text").height()+$(".box_outer").height())){
                    $(".mark").hide();
                    $(".nearby1").css({"overflow":null,"height":""});
                    $(".box_outer").hide();
                    $(".trailer_contain_text p").css({"color":"#000","border-bottom":" none"});
                }
            })
        })
        $(".box_left3 a").click(function(){
            var i=$(this).index();
            $(".box_left3 li").eq(i).addClass("box_show").siblings().removeClass();
            $("html").click(function(e){
                e.stopPropagation();
                var poy=e.pageY;
                if(poy<=$(".trailer").height()||poy>=($(".trailer").height()+$(".trailer_contain_text").height()+$(".box_outer").height())){
                    $(".mark").hide();
                    $(".nearby1").css({"overflow":null,"height":""});
                    $(".box_outer").hide();
                    $(".trailer_contain_text p").css({"color":"#000","border-bottom":" none"});
                }
            })
        })
        $("html").click(function(e){
            e.stopPropagation();
            var poy=e.pageY;
            if(poy<=$(".trailer").height()||poy>=($(".trailer").height()+$(".trailer_contain_text").height()+$(".box_outer").height())){
                $(".mark").hide();
                $(".nearby1").css({"overflow":null,"height":""});
                $(".box_outer").hide();
                $(".trailer_contain_text p").css({"color":"#000","border-bottom":" none"});
                $(".trailer_contain_text p img").attr("src","{{env('IMAGE_DOMAIN')}}/images/down_g.png?v={{env('IMAGE_VERSION')}}");
            }
        })
        // for (var i = 0; i < $(".busy_name").length; i++) {//商家名称字数限定
        //     if($(".busy_name").eq(i).html().length>8){
        //         var nearby_busyhtml=$(".busy_name").eq(i).html().substring(0,7);
        //         // alert($(".busy_name").eq(i).html())
        //         $(".busy_name").eq(i).html(nearby_busyhtml+"...");
        //     }
        // };
    })
</script>
@endsection